<template>
    <el-container class="mev-div-border">
        <el-header>
            <el-row>
                <el-col :span="16" style="text-align: left">
                    空间剖面分析
                </el-col>
                <el-col :span="8" style="position:absolute;top:-6px;right:0px;text-align: right">
                    <el-button @click="toolbarFunc('close')"><p style="position: absolute;right: 13px;top: 15px">关闭</p></el-button>
                </el-col>
            </el-row>
        </el-header>
        <el-main class="mev-div-border">
            <el-row>
                <el-col>
                    <el-button @click="start">选择线路</el-button>
                </el-col>
                <el-col>
                    <el-button :disabled="measurerLens === 0" @click="clearAll">清空线路</el-button>
                </el-col>
            </el-row>
        </el-main>
        <div id="drawprofile" style="position:absolute;left:230px;top:390px;width:577px;height:140px;"></div>
    </el-container>
</template>

<script>
import ProfileAnalysis from "../../../plugins/mev/measure/profile_analysis";

export default {
    name: "ProfileAnalysisComponent",

    data() {
        return {
            measurerLens: ProfileAnalysis.MEASURERS.length
        };
    },

    beforeDestroy() {
        this.clearAll();
    },

    methods: {
        toolbarFunc: function(method) {
            switch (method) {
                case "close": {
                    if (ProfileAnalysis.MEASURERS.length !== 0 && !ProfileAnalysis.lastMeasurer().stopped) {
                        ProfileAnalysis.lastMeasurer().stop();
                    }
                    if (this.$route.name !== "EmptyComponent") {
                        this.$router.push({ name: "EmptyComponent" });
                    }
                    break;
                }

                default:
                    break;
            }
        },

        start: function() {
            if (ProfileAnalysis.MEASURERS.length !== 0 && !ProfileAnalysis.lastMeasurer().stopped) {
                ProfileAnalysis.lastMeasurer().stop();
            }
            // console.log(ProfileAnalysis.MEASURERS.length);

            ProfileAnalysis.newInstance(window.cesiumViewer).start();
            this.measurerLens++;
        },

        clearAll: function() {
            if (ProfileAnalysis.MEASURERS.length !== 0 && !ProfileAnalysis.lastMeasurer().stopped) {
                ProfileAnalysis.lastMeasurer().stop();
            }
            ProfileAnalysis.lastMeasurer().destroyAll();
            this.measurerLens = 0;
        }
    }
};
</script>

<style scoped>
.el-container {
    color: #ffffff;
}

.el-header {
    line-height: 60px;
}

.el-main {
    margin: 10px;
    padding: 10px;
}

.el-button {
    margin-top: 5px;
    width: 100%;
}

#drawprofile {
    z-index: 999;
    position: absolute;
    bottom: -150px;
    left: 30vw;
    background-color: rgba(0, 0, 0, 0.9);
    display: none;
}
</style>
